<cfsilent>
	<cfset email = "" />
	<cfif structKEyExists(url,"email") and url.email neq "">
		<cfset email = url.email />
	</cfif>
</cfsilent>
	<!--- <style>
		.loginDiv{
			margin:auto;
			background-color:##c3c3c3;
			height:100%;
			width:320px;
			margin-top:5px;
		}
		.messageDiv{
			background-color:rgb(243, 232, 103);
			margin-bottom:5px;
			text-align:center;
			padding:3px;
		}
		.error{
			background-color:rgb(236, 106, 106);
			color:white;
		}
	</style>
	
	<cfif structKEyExists(url,"message") and url.message neq "">
		<div class="loginDiv messageDiv" style="display:none;">
			#url.message#
		</div>
	</cfif>
	
	<cfif structKEyExists(url,"error") and url.error neq "">
		<div class="loginDiv messageDiv error" style="display:none;">
			#url.error#
		</div>
	</cfif>

	<div class="loginDiv" style="display:none;">
		<form method="POST" name="login_form" id="login_form" action="#$.link.form(cfc='craftivityController',method='login')#">
			<div style="float:left;">&nbsp;email</div>
			<div style="float:right;">password&nbsp;</div>
			<div style="clear:both;"></div> 
			<input name="email" value="#email#" />
			<input name="password" type="password"/>
			<button type="submit">Log In</button>
			<button type="button" onclick="showCreateAccount();">Create Account</button>
		</form>
		
		<form method="POST" name="create_form" id="form" style="display:none;" action="#$.link.form(cfc='craftivityController',method='createAccount')#">
			<div style="float:left;">&nbsp;First Name</div>
			<div style="float:right;">Last Name&nbsp;</div>
			<div style="float:right;margin-right:110px;">M.I.&nbsp;&nbsp;&nbsp;&nbsp;</div>
			<div style="clear:both;"></div> 
			<input name="first_name" size="12">
			<input name="middle_name" size="1">
			<input name="last_name">
			<div style="clear:both;"></div> 
			<div style="float:left;">&nbsp;email</div>
			<div style="float:right;">confirm email&nbsp;</div>
			<div style="clear:both;"></div> 
			<input name="email">
			<input name="email2">
			<div style="clear:both;"></div> 
			<div style="float:left;">&nbsp;password</div>
			<div style="float:right;">confirm password&nbsp;</div>
			<div style="clear:both;"></div> 
			<input name="password" type="password">
			<input name="password2" type="password">
			<button type="submit">Create Account</button>
		</form>
		
		<script>
			showCreateAccount = function(){
				$('form[name=login_form]').hide();
				$("form[name=create_form]").show();
			};
		</script>
	</div> --->
	<!DOCTYPE html>
	<html class="no-js" lang="en">
		<head>
		  <meta charset="utf-8" />
		<meta name="google-site-verification" content="MJZmHKqC22Tl0y0EhlcgNE_pblWf1sGyNRdoP2V1Llg" />
		  <!-- Set the viewport width to device width for mobile -->
		  <meta name="viewport" content="width=device-width, maximum-scale=1, user-scalable=no" />
		
		  <title>Craftivity : The goal setting & productivity app for creative people</title>
		  
		<link rel="stylesheet" href="/craftivity/assets/css/landingPage.css">
		<link href='https://fonts.googleapis.com/css?family=Droid+Sans:400,700|Montserrat:400,700' rel='stylesheet' type='text/css'>
		<link href='https://fonts.googleapis.com/css?family=Lily+Script+One' rel='stylesheet' type='text/css'>

		  <!--- <link rel="stylesheet" href="stylesheets/foundation.css">
		  <link rel="stylesheet" href="stylesheets/flexslider.css">
		  <!--<link rel="stylesheet" href="stylesheets/animate.css">-->
		  <link rel="stylesheet" href="stylesheets/entypo.css">
		  <link rel="stylesheet" href="stylesheets/style.css">
		  <link rel="stylesheet" href="stylesheets/responsive.css">
		  <link href='http://fonts.googleapis.com/css?family=Droid+Sans:400,700|Montserrat:400,700' rel='stylesheet' type='text/css'>
		  <link href='http://fonts.googleapis.com/css?family=Lily+Script+One' rel='stylesheet' type='text/css'> --->
		
		  <script src="/craftivity/assets/landingPage/modernizr.foundation.js"></script>
		</head>
		
		<body>
			<div id="main-container">
			<div id="main-nav">
				<div class="row">
						<div class="twelve columns">
						<div id="logo" class="left animated fadeInDown">
							<img src="/craftivity/assets/landingPage/logo-simple.png" alt="Craftivity" /> 
							<cfoutput>
								<cfif structKEyExists(url,'signup')>
									<span id="tagline" style="color:red;font-style:italic;font-weight:bold;text-shadow:0px 0px 5px rgb(221,221,221);">Thanks so much for your interest :) We'll be in touch soon!</span>
								<cfelse>
									<cfif structKeyExists(url,'error')>
										<span id="tagline" style="color:purple">Sorry, there was a problem. #url.error#</span>
									<cfelse>
										<span id="tagline">The goal setting & productivity app for creative people</span>
									</cfif>
								</cfif>
							</cfoutput>
						</div>
						
						<div id="mobile-toggle" class="show-for-small"><i class="entypo list"></i></div>
						<div id="nav-holder" class="right">
							<ul style="">
								<li><a href="#features-scroll" class="scroll">FEATURES</a></li>
								<li><a href="#gallery-scroll" class="scroll">HOW IT WORKS</a></li>
								<!--<li><a href="#pricing-scroll" class="scroll">PRICING</a></li>-->
								<li><a href="#faq-scroll" class="scroll">F.A.Q</a></li>
								<li>
									<a href="#sign-up" class="scroll">
										<div class="blue-btn">Sign Up</div>
									</a>
									<a id="loginLink" href="javascript:$('#nav-holder').find('ul').fadeOut(function(){$('#login-div').fadeIn(function(){$('input[name=email]:first').focus();});});">member login</a>
								</li>
								<!--- <li><a href="#sign-up" class="scroll"><div class="blue-btn">Log In</div></a></li> --->
							</ul>
							<div id="login-div" style="display:none;">
								<cfoutput>
								<form method="POST" name="login_form" id="login_form" action="#$.link.form(cfc='craftivityController',method='login')#">
									<input class="formInputs" placeholder="Your Email" name="email" value="" type="email" validate="maxLength100" />
									<input class="formInputs" placeholder="Your Password" name="password" type="password" value="" validate="maxLength100" />
									<button name="form_submit" type="submit">go</button>
								</form>
								</cfoutput>
							</div>
						</div>
					</div>
				</div>
			</div>
			
			<section id="home">
				<div class="row">
			
						<div id="home-slider" class="flexslider">
							<ul class="slides">
								<!-- Use li for every new slide -->
								<li>
									
									<div class="animated fadeInRightBig slide-right">
										<div style="text-align:center;">
											<h1>Achieve your goals and increase your productivity. Made for makers, artists and designers.</h1>
											<p class="hide-for-small">
												<br />
												When you're more productive, you'll hit your goals. When you hit your goals, you'll make more money. 
												<br />
												Do more with your day without losing sight of what's important. Connect with other creatives like you.
											</p>
										</div>
									</div>
									<a href="#features-scroll" class="scroll"><div class="btn right">Explore Features</div></a>
								</li>
								
								<!--<li>
									<div class="six columns animated fadeInLeftBig slide-left  hide-for-small">
										<iframe src="http://player.vimeo.com/video/59584804?portrait=0&amp;color=31b7cc"></iframe>
									</div>
									
									<div class="six columns animated fadeInDownBig slide-right">
										<h1 class="text-right">Flexslider With Video Embeds? Oh Yes.</h1>
										<div class="hr  hide-for-small"></div>
										<p class="right text-right  hide-for-small">
											Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. 
										</p>
										
										<a href="#pricing-scroll" class="scroll"><div class="btn right">View Pricing</div></a>
									</div>
								</li>-->
								
							
							</ul>
						</div>
					
				</div>
			</section>
			
			<a id="features-scroll"></a>
			<section id="feature-list" class="odd-section">
			
					
				<div class="row inner-section section-preamble text-center animated fadeInDown">
					<h2>What is Craftivity?</h2>
					<p>
						Craftivity is packed with the most essential tools to help you be more productive and reach your goals.
					</p>
					<div class="hr"></div>
				</div>
				
				<div class="row feature-row inner-section flyIn">
					<div class="three columns feature text-center">
						<img alt="Feature Icon" src="/craftivity/assets/landingPage/smart-decisions.png" />
						<h4 class="alt-h">SMART DECISIONS</h4>
						<p>
							We have an in-built consulting/coaching element within Craftivity to help you set SMART goals and teach you how to achieve more of them.
						</p>
					</div>
					
					<div class="three columns feature text-center">
						<img alt="Feature Icon" src="/craftivity/assets/landingPage/builtin-calendar.png" />
						<h4 class="alt-h">BUILT-IN CALENDAR</h4>
						<p>
							Syncs with Google Calendar and design your weekly schedule with the WorkWeek Designer. 
						</p>
					</div>
					
					<div class="three columns feature text-center">
						<img alt="Feature Icon" src="/craftivity/assets/landingPage/goal-tracker.png" />
						<h4 class="alt-h">GOAL TRACKER</h4>
						<p>
							List your goals and break them down into actionable steps. Keep track of goals over time so you can see how you've progressed!
						</p>
					</div>
					<div class="three columns feature text-center">
						<img alt="Feature Icon" src="/craftivity/assets/landingPage/social.png" />
						<h4 class="alt-h">FORUMS, CHAT, GROUPS</h4>
						<p>
							Meet friends in forums, chat with them privately and create support groups to stay accountable!
						</p>
					</div>
					
					<!--<div class="three columns feature text-center">
						<img alt="Feature Icon" src="http://placehold.it/130x130" />
						<h4 class="alt-h">IMPORTANT THIS WEEK</h4>
						<p>
							A simple but powerful tool to help you stay on track with your big picture goals. Rome wasn't build in a day!
						</p>
					</div>-->
					
					<!--<div class="three columns feature text-center">
						<img alt="Feature Icon" src="http://placehold.it/130x130" />
						<h4 class="alt-h">IMPORTANT THIS WEEK</h4>
						<p>
							Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo.
						</p>
					</div>-->
				</div>
			
			
			</section>
			
			<a id="gallery-scroll"></a>
			<section id="features-detail" class="even-section">
			
				<div class="row inner-section section-preamble text-center flyIn">
					<h2>How will Craftivity help me?</h2>
					
					<p>
						As a creative business owner of my handmade jewelry line, I've been there and I know how chaotic it can make your life feel. Here's how Craftivity can help you:
					</p>
					<div class="hr"></div>
				</div>
				
				<div class="row inner-section platform-row">
				
					<div class="six columns flyLeft text-center">
						<div class="flexslider">
							<ul class="slides">
								<li>
									<img alt="desktop" src="/craftivity/assets/landingPage/milestones.jpg" />
								</li>					
							</ul>
						</div>
					</div>
					
					<div class="six columns flyRight text-right">
						<h2 class="text-right">Reach your goals</h2>
						<p class="text-right">
							Have you ever written a list of goals you'd like to accomplish, only to never look at it again? 
							<br /><br />Craftivity keeps your business goals at the forefront of everything you do, so every step you take each week brings you closer to achieveing what you desire for your business!
						</p>
						<a href="#sign-up" class="scroll"><div class="green-btn">Get on the waiting list</div></a>
						<!--<div class="blue-btn">Buy Now</div>-->		</div>
					
				
				</div>
				
				<div class="mid-row">
					<div class="row inner-section platform-row">
					
				
						<div class="six columns flyLeft text-left">
							<h2 class="text-left">Be more productive</h2>
							<p class="text-left">
								According to Dr. Joseph Juran, management consultant and engineer, 80% of your time should be spent on marketing your business. You work online at your computer to answer emails, engage with social media followers and list new products. 
								<br /><br />
								Physical planners and scraps of paper don't cut it anymore - they get lost in your creative mess and can't even send you reminders on what to do next. They also don't take into account unplanned events (like that big rush order you just got this morning) or less motivating days - we all get them!
								<br /><br />
								Craftivity sits closely next to you during these moments to help you stay on track with what's really important to do in your marketing activities. Easily shuffle tasks around when needed while staying on track with the big picture.
							</p>
							<a href="#sign-up"  class="scroll"><div class="green-btn">Get on the waiting list</div></a>
							<!--<div class="blue-btn">Buy Now</div>-->
						</div>
						
						<div class="six columns flyRight text-center">
							<div class="flexslider">
								<ul class="slides">
									<li>
										<img alt="desktop" src="/craftivity/assets/landingPage/productive-small.jpg" />
									</li>
								</ul>
							</div>
						</div>
						
					
					</div>
				</div>
				
				<div class="row inner-section platform-row">
				
					<div class="six columns flyLeft text-center">
						<div class="flexslider">
							<ul class="slides">
								<li>
									<img alt="desktop" src="/craftivity/assets/landingPage/forum.jpg" />
								</li>
							</ul>
						</div>
					</div>
					
					<div class="six columns flyRight text-right">
						<h2 class="text-right">You won't be alone</h2>
						<p class="text-right">
							Craftivity will bring together many creative people like you - handmade jewelry designers, graphic artists, bath and body artisans, accessory makers and so on. 
							<br /><br />
							Chat with others in similar stages of business as you, share resources and ask questions! Be a part of the community, make friends and know you're not alone!
							<br /><br />
							You can even form support groups with your friends!
						</p>
						<a href="#sign-up"  class="scroll"><div class="green-btn">Get on the waiting list</div></a>
						<!--<div class="blue-btn">Buy Now</div>-->
					</div>
					
				
				</div>
				
				<div class="mid-row">
					<div class="row inner-section platform-row">
					
				
						<div class="six columns flyLeft text-left">
							<h2 class="text-left">Stay on track</h2>
							<div class="hr"></div>
							<p class="text-left">
								When an important goal is not getting accomplished, Craftivity will send you reminders to get them done and keep you accountable. 
								<br /><br />
								We'll also send you tips on how to achieve more of your goals when you feel less motivated. 
								<br /><br />
								It's like having your best friend cheerlead you along the way to success!
							</p>
						<a href="#sign-up"  class="scroll"><div class="green-btn">Get on the waiting list</div></a>
						<!--<div class="blue-btn">Buy Now</div>-->
						</div>
						
						<div class="six columns flyRight text-center">
							<div class="flexslider">
								<ul class="slides">
									<li>
										<img alt="desktop" src="/craftivity/assets/landingPage/milestones.jpg" />
									</li>
								</ul>
							</div>
						</div>
						
					
					</div>
				</div>
			
			
			</section>
			
			<a id="sign-up"></a>
			<section id="newsletter">
			
				<div class="row inner-section">
					<div class="seven columns">
						<i class="entypo newspaper">&nbsp;</i>
						<div id="newsletter-text">
							<h3 class="text-white">Join the waiting list for Craftivity here. Enter your email address and get first dibs when we launch!</h3>	
						</div>
					</div>
				
				
					<div class="five columns">
						<div class="details-error-wrap hide">Please enter a valid email address</div>
						<form method="POST" name="submit_email" id="submit_email" action="/cfcs/action.cfm?cfc=craftivityController&amp;method=addSignupEmail" onsubmit="">
							<input name="email" class="newsletter-email left" type="text" placeholder="Your Email Address" validate="maxLength200" />
							<button class="newsletter-btn left btn form-send" type="submit" value="Signup!" onclick="$('form#submit_email').submit();">Signup!</button>
						</form>
						<div class="hide green-btn newsletter-btn left btn form-sent">Submitted!</div>
					</div>
				
				</div>
				
			</section>
			
			<!--
			<a id="pricing-scroll"></a>
			<section id="pricing" class="even-section">
				<div class="row inner-section section-preamble text-center flyIn">
					<h2>Awesome features that wont break the bank.</h2>
					
					<p>
						Temporibus autem quibusdam et aut officiis recusandae. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat
					</p>
					<div class="hr"></div>
				</div>
				
				<div class="row inner-section">
				
				
					<div class="four columns price-table text-center fast-anim flyIn">
						<div class="price-heading">
							<h4 class="text-white">Standard</h4>
						</div>
						
						<div class="price-amount">
							<h2 class="text-white">$49 p/m</h2>
						</div>
						
						<ul class="price-details">
							<li>20 Logins</li>
							<li>Secure Backup</li>
							<li>Cloud Server</li>
							<li>10 Beers</li>
						</ul>
						
						<div class="price-purchase">
							<a href="#"><div class="red-btn btn">Buy Now</div></a>
						</div>
					</div>
					
					<div class="four columns price-table text-center flyIn">
						<div class="price-heading">
							<h4 class="text-white">Professional</h4>
						</div>
						
						<div class="price-amount">
							<h2 class="text-white">$79 p/m</h2>
						</div>
						
						<ul class="price-details">
							<li>80 Logins</li>
							<li>Offsite Backup</li>
							<li>Cloud Server</li>
							<li>100 Beers</li>
						</ul>
						
						<div class="price-purchase">
							<a href="#"><div class="red-btn btn">Buy Now</div></a>
						</div>
					</div>
					
					<div class="four columns price-table text-center slow-anim flyIn">
						<div class="price-heading">
							<h4 class="text-white">Enterprise</h4>
						</div>
						
						<div class="price-amount">
							<h2 class="text-white">$129 p/m</h2>
						</div>
						
						<ul class="price-details">
							<li>200 Logins</li>
							<li>Offsite Backup</li>
							<li>Cloud Server</li>
							<li>1000 Beers</li>
						</ul>
						
						<div class="price-purchase">
							<a href="#"><div class="red-btn btn">Buy Now</div></a>
						</div>
					</div>
					
					
				</div>
			
			</section>-->
			
			<a id="faq-scroll"></a>
			<section id="faq" class="even-section">
			
				<div class="row inner-section section-preamble text-center flyIn">
					<h2>Got Questions?</h2>
					
					<p>
						If you have a question not listed below, please don't hesitate to email Mei at mei[at]craftivity.me
					</p>
					<div class="hr"></div>
				</div>
				
				<div class="row inner-section">
				
					<div class="four columns fast-anim flyIn">
				
						<div class="question-holder">
							<div class="question">
								<span class="text-white">Who should use Craftivity?</span>
							</div>
							<div class="answer animated">
								<p>
									If you freelance, are self employed or run your own business, Craftivity is for you! We built this webapp for creative minds and environments. You don't answer to a singular "big boss", your business is fueled by your creativity and you require a ton of self initiation to make money. 
								</p>
							</div>	
						</div>
						
						<div class="question-holder">
							<div class="question">
								<span class="text-white">How much does it cost?</span>
							</div>
							<div class="answer animated">
								<p>
									Craftivity costs $5 a month or $50 a year. We truly believe that by using this webapp, you'll reach more goals than you ever have before, while making more money in your business at the same time. All for less than a quarter a day!
								</p>
							</div>	
						</div>
			
					
					</div>
					
					<div class="four columns flyIn">
				
						<div class="question-holder">
							<div class="question">
								<span class="text-white">I already use a planner. <br />Why should I use Craftivity?</span>
							</div>
							<div class="answer animated">
								<p>
									Craftivity is so much more than just a planner. It's a goal tracker, a strategizer, a guide, a support tool and a community, all in one. It's like your paper planner but on steroids.  
								</p>
							</div>	
						</div>
						
						<div class="question-holder">
							<div class="question">
								<span class="text-white">Is there a trial period?</span>
							</div>
							<div class="answer animated">
								<p>
									Yes! Take Craftivity for a test drive for 30 days and see if it's a right fit for you. No credit card is required when you sign up.
								</p>
							</div>	
						</div>
			
					
					</div>
					
					<div class="four columns slow-anim flyIn">
				
						<div class="question-holder">
							<div class="question">
								<span class="text-white">What devices can Craftivity be used on?</span>
							</div>
							<div class="answer animated">
								<p>
									Craftivity is a webapp - any device with a browser and internet connection can use Craftivity. No installation of software necessary!
								</p>
							</div>	
						</div>
						
						<div class="question-holder">
							<div class="question">
								<span class="text-white">How can I get started?</span>
							</div>
							<div class="answer animated">
								<p>
									Craftivity will be available for you to use in August 2014. If you'd like to be given first dibs when we launch, please <a href="#sign-up" class="scroll">sign up here</a>.  
								</p>
							</div>	
						</div>
			
					
					</div>
				
				
				</div>
			
			</section>
			
			<!--<section id="as-seen" class="even-section">
			
				<div class="row inner-section section-preamble text-center flyIn">
					<h2>The Critics Love Us</h2>
					
					<p>
					</p>
					<div class="hr"></div>
				</div>
				
				<div class="row inner-section text-center">
					<div class="three columns flyIn">
						<img alt="critic" src="http://placehold.it/210x90" />
						<div class="critic-review">
							<i class="entypo star text-white"></i>
							<i class="entypo star text-white"></i>
							<i class="entypo star text-white"></i>
							<i class="entypo star text-white"></i>
							<i class="entypo star-empty text-white"></i>
							<h5>"Stunning!"</h5>
						</div>
					</div>
					
					<div class="three columns flyIn">
						<img alt="critic" src="http://placehold.it/210x90" />
						<div class="critic-review">
							<i class="entypo star text-white"></i>
							<i class="entypo star text-white"></i>
							<i class="entypo star text-white"></i>
							<h5>"Intuitive and flexible - superb!"</h5>
						</div>
						
					</div>
					
					<div class="three columns flyIn">
						<img alt="critic" src="http://placehold.it/210x90" />
						<div class="critic-review">
							<i class="entypo star text-white"></i>
							<i class="entypo star text-white"></i>
							<i class="entypo star text-white"></i>
							<i class="entypo star text-white"></i>
							<i class="entypo star text-white"></i>
							<h5>"In a word, this app is innovative."</h5>
						</div>
					</div>
					
					<div class="three columns flyIn">
						<img alt="critic" src="http://placehold.it/210x90" />
						<div class="critic-review">
							<i class="entypo star text-white"></i>
							<i class="entypo star text-white"></i>
							<i class="entypo star text-white"></i>
							<i class="entypo star text-white"></i>
							<i class="entypo star-empty text-white"></i>
							<h5>"Perfection!"</h5>
						</div>
					</div>
				</div>
				
			</section>-->
			
			<section id="footer">
				<div class="row inner-section">
				
					<div class="three columns">
						<h5 class="footer-title">NAVIGATE</h5>
						
						<ul>
							<li><a href="#gallery-scroll" class="scroll">HOW IT WORKS</a></li>
							<li><a href="#features-scroll" class="scroll">FEATURES</a></li>
							<li><a href="#faq-scroll" class="scroll">F.A.Q</a></li>					
							<li><a href="#sign-up" class="scroll">SIGN UP</a></li>
						</ul>
					</div>
					
					<div class="three columns">
						<h5 class="footer-title">ABOUT US</h5>
						
						<p>
							Craftivity is created by Mei Pak and Peter Chang, a couple who are all too familiar with running a small business. We're based in Minnesota and have a passion for helping other small businesses succeed.
					    </p>
					</div>
					
					<div class="three columns">
						<h5 class="footer-title">CONTACT</h5>
						<div class="mail-link">
							<a href="mailto:mei@craftivity.me">mei@craftivity.me</a>
							
						</div>
						<div class="footer-social">
							<a href="https://www.facebook.com/craftivityapp" target="_blank"><img src="/craftivity/assets/landingPage/facebook.png" alt="Facebook"></a>
							<a href="https://twitter.com/craftivityapp" target="_blank"><img src="/craftivity/assets/landingPage/twitter.png" alt="Twitter"></a>
						</div>
						
					</div>
					
					<div class="three columns">
						
						
					</div>
				
				</div>
			</section>
			
			</div>
			
			  
			  <!-- Included JS Files (Compressed) -->
			  <script src="/craftivity/assets/landingPage/foundation.min.js"></script>
			  
			  <!-- Initialize JS Plugins -->
			  <script src="/craftivity/assets/landingPage/jquery.flexslider-min.js"></script>
			  <script src="/craftivity/assets/landingPage/inview.js"></script>
			  <script src="/craftivity/assets/landingPage/smooth-scroll.js"></script>
			  <script src="/craftivity/assets/landingPage/scripts.js"></script>
			</body>
		</html>
